import React, { useEffect, useState } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { ColumnsType, TableProps } from '_antd@4.24.12@antd/es/table';
import ActivityTable from '@/pages/dashboard/workplace/components/ActivityTable';
import {
  Typography,
  PageHeader,
  Row,
  Tag,
  Table,
  Card,
  Tabs
} from 'antd';
import type { TabsProps } from 'antd';
const { Paragraph } = Typography;//说明文字的标签
import {
  getactivityList,
  getOwnActivityList
} from '@/services/workplace'
interface DataType {
  key: string;
  activityLabel: string;
  organizationalUnit: string;
  activityAddress: string;
  startTime: string;
  endTime: string;
}
//tab页
const filteredData = (activityList: DataType[]) => {
  const levelZeroData: DataType[] = [];
  for (const item of activityList) {
    switch (item.activityLevel) {
      case '0':
        levelZeroData.push(item);
        break;
      default:
        break;
    }
  }
  return {
    levelZeroData,

  };
};


const ActivityList: React.FC = () => {
  const [activeList, setactiveList] = useState(null);//全部活动
  const [levelZeroData, setLevelZeroData] = useState(null);//我的活动

  const items: TabsProps['items'] = [
    {
      key: '1',
      label: `全部`,
      children: <ActivityTable activeList={activeList} />,
    },
    {
      key: '2',
      label: `我的活动`,
      children: <ActivityTable activeList={levelZeroData} />,
    },
  ];
  useEffect(() => {
    fetchData();
  }, [])
  const fetchData = async () => {//获取活动列表
    try {
      const response = await getactivityList(null, null);
      if (response && response.result) {
        setactiveList(response.result);
        console.log(response.result)
      }
    } catch (error) {
      console.error('Error fetching user info:', error);
    }
    try {
      const ownResponse = await getOwnActivityList(null, null);
      if (ownResponse && ownResponse.result) {
        setLevelZeroData(ownResponse.result);
        console.log(ownResponse.result)//我的活动
      }
    } catch (error) {
      console.error('Error fetching user info:', error);
    }
  };
  //说明文字标签定义
  const content = (
    <>
      <Paragraph>
        河北工业大学电气工程学院举办系列活动具有重要意义。这些活动展示学院实力，拓宽学生知识面，培养实践能力，加强团队合作，并与专家、企业交流。活动提供实践锻炼，促进学术水平提高，培养学生综合素质，推动学院与业界合作。
      </Paragraph>
      <Paragraph>
        这些活动为电气工程学院提供了一个展示学院实力和学生才华的窗口。通过举办各类学术讲座、科技竞赛、创新创业活动等，学院能够吸引更多的人关注学院的教学质量和实践能力，提升学院的知名度和声誉。
      </Paragraph>
      <Paragraph>
        这些活动为学生提供了一个实践和锻炼的平台。通过参与活动，学生可以将在课堂上学到的知识应用到实际情境中，培养解决问题和创新思维的能力。
      </Paragraph>
    </>
  );
  //学生图像标签定义
  const Content = ({ children, extraContent }: any) => (
    <Row>
      <div style={{ flex: 1 }}>{children}</div>
      <div className="image">{extraContent}</div>
    </Row>
  );

  const onChange: TableProps<DataType>['onChange'] = (pagination, filters, sorter, extra) => {
    console.log('params', pagination, filters, sorter, extra);
  };
  return (
    <PageContainer>
      <Card style={{ marginBottom: 24 }}>
        <PageHeader title="热门活动" subTitle="学生" tags={<Tag color="blue">运行中</Tag>}
          avatar={{ src: require('@/assets/activity.jpg') }}
        >
          <Content>
            {content}
          </Content>
        </PageHeader>
      </Card>
      <Card style={{ marginBottom: 24 }}>
        <Tabs defaultActiveKey="1" items={items} />
      </Card>
    </PageContainer>
  )
}

export default ActivityList;
